<template>
	<view>
		<view class="out-line" style="margin-top: 30rpx;border-top: 1px solid #E2E2E2;">
			<view class="common-width90 flex-just column-middle">
				<text class="left-text">昵称：{{userInfo.nickName}}</text>
				<image class="right-icon" src="/static/center/turnRight.png"></image>
			</view>

		</view>
		<view class="out-line">
			<view class="common-width90 flex-just column-middle">
				<text class="left-text" v-if="userInfo.gender == 2">性别：女</text>
				<text class="left-text" v-if="userInfo.gender == 1">性别：男</text>
				<text class="left-text" v-if="userInfo.gender == 0">性别：未知</text>
				<image class="right-icon" src="/static/center/turnRight.png"></image>
			</view>

		</view>
		<view class="out-line">
			<view class="common-width90 flex-just column-middle">
				<text class="left-text">专业班级：外包162</text>
				<image class="right-icon" src="/static/center/turnRight.png"></image>
			</view>
		</view>
		<view class="out-line">
			<view class="common-width90 flex-just column-middle">
				<text class="left-text">省份：{{userInfo.province}}</text>
				<image class="right-icon" src="/static/center/turnRight.png"></image>
			</view>
		</view>
		<view class="out-line">
			<view class="common-width90 flex-just column-middle">
				<text class="left-text">城市：{{userInfo.city}}</text>
				<image class="right-icon" src="/static/center/turnRight.png"></image>
			</view>
		</view>
		<view class="out-border-line" @click="turnDeliveryAddress()">
			<view class="common-width90 flex-just column-middle">
				<image src="/static/center/userInfo/lianxirenS.png" class="userInfo-icon"></image>
				<text class="left-text">收货地址</text>
				<image class="right-icon" src="/static/center/turnRight.png"></image>
			</view>
		</view>
		<view class="width-90">
			<button class="common-button" style="background: #E64340" @click="outLogin()">退出登录</button>
		</view>
	</view>
</template>

<script>
	import {
		getUserInfo
	} from '@/common/api/quickRegister/quickRegister.js'
	export default {
		data() {
			return {
				userInfo: {}
			}
		},
		methods: {
			// 获取登录者的用户信息
			getUserInfo: function(){
				getUserInfo().then(res => {
					if(res.data.code == 200) {
						if(res.data.data != null) {
							this.userInfo = res.data.data.info
						}
					} else {
						uni.showToast({
							title: "网络错误",
							icon: 'none'
						})
					}
				})
			},
			// 点击退出登录
			outLogin:function() {
				uni.setStorageSync('isAlreadyLogin', false);
				uni.removeStorageSync("memberId")
				uni.reLaunch({
					url: '/pages/center/center'
				})
			},
			// 跳转到地址列表
			turnDeliveryAddress:function() {
				uni.navigateTo({
					url: '/pages/center/deliveryAddress/deliveryAddress'
				})
			}
		},
		onLoad() {
			this.getUserInfo()
		}
	}
</script>

<style>
	/* 此处的不用隔开所以重新弄一个outline */
	.out-line {
		width: 100%;
		height: 100%;
		border-bottom: 1px solid #E2E2E2;
	}

	.left-text {
		width: 80%;
		height: 80rpx;
		font-size: 18px;
		font-weight: bold;
		line-height: 80rpx;
	}

	.right-icon {
		width: 30rpx;
		height: 30rpx;
	}
	.userInfo-icon{
		width: 50rpx;
		height: 50rpx;
	}
</style>
